﻿@using Think9.Models;
@{ ViewBag.Title = "Add";
    Layout = "~/Views/Shared/_LayuiForm.cshtml"; }


<input style="display:none" id="RuleId" value="@Model.RuleId">
<input style="display:none" id="ValueScope" value="@Model.ValueScope">
<input style="display:none" id="TbId" value="@Model.TbId">
<input style="display:none" id="DictItemId" value="@Model.DictItemId">
<input style="display:none" id="ValueFiled" value="@Model.ValueFiled">
<input style="display:none" id="TxtFiled" value="@Model.TxtFiled">
<input style="display:none" id="OrderFiled" value="@Model.OrderFiled">
<form class="layui-form"  lay-filter="formUser">
    <div class="layui-form-item">
        <label class="layui-form-label">名 称</label>
        <div class="layui-input-block">
            <input type="text" name="Name" placeholder="必填 请输入名称" autocomplete="off" class="layui-input" lay-verify="required">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">取值方式</label>
        <div class="layui-input-block">
            <input type="text" name="TbId_Exa" id="TbId_Exa"  readonly="readonly" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">Value字段</label>
        <div class="layui-input-block">
            <input type="text" name="ValueFiled_Exa" id="ValueFiled_Exa"  readonly="readonly" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">Text字段</label>
        <div class="layui-input-block">
            <input type="text" name="TxtFiled_Exa" id="TxtFiled_Exa"  readonly="readonly" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-row">
            <div class="layui-col-md10">
                <label class="layui-form-label">排序字段</label>
                <div class="layui-input-block">
                    <input type="text" name="OrderFiled_Exa" id="OrderFiled_Exa"  readonly="readonly" class="layui-input">
                </div>
            </div>
            <div class="layui-col-md2"  align="left">
                <div class="layui-input-block">
                    <input type="hidden" name="OrderType" value="1">
                    <input type="checkbox" id="OrderType" name="OrderType"  value="2" title="倒序">
                </div>
            </div>
        </div>
    </div>

        <fieldset class="table-fieldset">
            <legend>筛选条件</legend>
            <div class="layui-form-item">
                <label class="layui-form-label">连 接</label>
                <div class="layui-input-inline">
                    <select name="linkstr" id="linkstr">
                        <option value=""></option>
                        <option value=" AND "> 并且 ( AND )</option>
                        <option value=" OR "> 或者 ( OR )</option>
                    </select>
                </div>
                <label class="layui-form-label">判 断</label>
                <div class="layui-input-inline">
                    <select name="judge" id="judge">
                        <option value="=">等于</option>
                        <option value=">">大于</option>
                        <option value=">=">大于等于</option>
                        <option value="<">小于</option>
                        <option value="<=">小于等于</option>
                        <option value="<>">不等于</option>
                        <option value="like">包含</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">字 段</label>
                <div class="layui-input-block">
                    <select id="ConditionFiled" name="ConditionFiled">
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">值</label>
                <div class="layui-input-inline">
                    <input type="text" name="valuekey" id="valuekey" placeholder="输入或选择" class="layui-input">
                </div>
                <div class="layui-inline">
                    <button type="button" class="layui-btn layui-btn-primary" id="selectvalue"><i class="fa fa-check"></i></button>
                </div>
                <div class="layui-inline">
                    <button type="button" class="layui-btn " id="addvalue"><i class="fa fa-plus"></i>添加筛选条件</button>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">筛选条件</label>
                <div class="layui-input-block">
                    <textarea class="layui-textarea" id="LimitStr" name="LimitStr"></textarea>
                </div>
            </div>
        </fieldset>

        <br />
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="add">添加</button>
            </div>
        </div>
</form>
<script>
    layui.use(["form", "exLayer", "exUtils", "layer"], function () {
        let form = layui.form;
        let exLayer = layui.exLayer;
        let exUtils = layui.exUtils;
        let tableSelect = layui.tableSelect;
        let layer = layui.layer;

        let $ = layui.$;

        form.render(); //初始化表单，要加上，不然刷新部分组件可能会不加载


        //给表单赋值
        form.val("formUser", { //formUser 即 class="layui-form" 所在元素属性 lay-filter="" 对应的值
            "Name": "@Model.Name",
            "TbId_Exa": "@Model.TbId_Exa",
            "ValueFiled_Exa": "@Model.ValueFiled_Exa",
            "TxtFiled_Exa": "@Model.TxtFiled_Exa",
            "OrderFiled_Exa": "@Model.OrderFiled_Exa",
            "OrderType": "@Model.OrderType",
            "LimitStr": "@Model.LimitStr"
        });

        //监听的元素有select(选中) ，checkbox（勾选）,swich(开关),radio(选择),submit(提交)
        form.on('select(selectfilter)', function (data) {
            GetConditionFieldListByTb(data.value);
        })

        form.on("submit(add)", function (data) {
            exUtils.ajax("/RuleSingle/Add", "post", data.field, true).done(function (response) {
                exLayer.greenTickMsg(response.message, function () {
                    parent.location.reload(); // 父页面刷新
                    parent.layer.close(parent.layer.getFrameIndex(window.name));//先得到当前iframe层的索引 再执行关闭
                });
            }).fail(function (error) {
                console.log(error)
            });
            return false;
        });

        $('#selectvalue').on('click', function () {
            exLayer.openMiddle('选择', '/RuleList/PUParameter', '500px', '450px', null, null);
        });

        $('#addvalue').on('click', function () {
            var _old = $("#LimitStr").val();
            var _new = _old + ' ' + $("#linkstr").val() + ' ' + $("#ConditionFiled").val().substring(4) + ' ' + $("#judge").val() + ' ' + $("#valuekey").val();
            $("#LimitStr").val(_new);

            $("#valuekey").val('');
        });


        function GetConditionFieldListByTb(id) {
            var controlid = "#ConditionFiled";
            $("" + controlid + "").empty(); //清空控件
            $.getJSON("/RuleSingle/GetConditionFieldList", { id: id }, function (data) {
                $.each(data, function (i, item) {
                    $("" + controlid + "").append(new Option(item.Text, item.Value));
                });
                form.render();//一定要加并且只能加在此处 否则下拉框不正确显示
            });
        }

    });
</script>